<div ng-controller="classInfoCtrl">
  <div class="well with-header  with-footer">
    <div class="header">商品类别税率</div>
    <a id="editabledatatable_new" ng-click="addLargeClass()" class="btn btn-default" style="margin-bottom:10px;"><i class="fa fa-plus"></i>添加新的商品类别</a>
    <form role="form" ng-submit="sureAddClass()" method="post">
    <table  class="table table-striped table-hover table-bordered">
        <thead>
            <tr role="row">
                <th>序号</th>
                <th>商品类别</th>
                <th>税率</th>
                <th>    </th>
            </tr>
        </thead>
        <tbody id="goods-distribution" >
          <tr ng-if="showAddClass">
               <td></td>
                <td>
                  <input type="text" ng-model="newLargeClass.largeClassName" required placeholder="名称"/>
                </td>
                <td>
                  <input type="number" ng-model="newLargeClass.largeClassVat"  required min="0" max="100" step="0.01" />
                </td>
                <td>
                  <button type="submit" class="btn btn-success btn-xs save"><i class="fa fa-save"></i>确认</button>
                  <a ng-click="addLargeClass()" class="btn btn-warning btn-xs cancel"><i class="fa fa-times"></i> 取消</a>
                </td>
            </tr>
            <tr ng-repeat="goods in classes" key={{goods.largeClassId}}>
                <td>
                  {{$index+1}}
                </td>
                <td>
                  <span ng-if="!goods.editActive">
                    <a ui-sref="smallClassInfo({largeClassId:{{goods.largeClassId}},largeClassName:'{{goods.largeClassName}}'})">{{goods.largeClassName}}</a>
                  </span>
                  <input ng-model="goods.newLargeClassName" ng-if="goods.editActive" type="text" minlength="1" ng-init="goods.newLargeClassName=goods.largeClassName">
                </td>
                <td>
                  <input ng-model="goods.newLargeClassVat" ng-if="goods.editActive" type="number" min="0" max="100" step="0.1" ng-init="goods.newLargeClassVat=(goods.largeClassVat*100).toFixed(0)">
                  <span ng-if="!goods.editActive">{{(goods.largeClassVat*100).toFixed(0)}}</span><span>%</span>
                </td>
                <td>
                    <a ng-if="!goods.editActive" class="btn btn-info btn-xs updateGoods edit " key={{goods.largeClassId}} ng-click="updateGoods($index,goods.largeClassId)"><i class="fa fa-edit"></i> 修改</a>
                    <a ng-if="!goods.editActive" class="btn btn-danger btn-xs delete" ng-click="showDelModel(goods.largeClassId)"><i class="fa fa-trash-o"></i> 删除</a>
                    <a ng-if="goods.editActive"  ng-click="sureUpdateGoods($index,goods.largeClassId)" class="btn btn-success btn-xs save"><i class="fa fa-save"></i> 确认</a>
                    <a ng-if="goods.editActive"  ng-click="updateGoods($index,goods.largeClassId)" class="btn btn-warning btn-xs cancel"><i class="fa fa-times"></i> 取消</a>
                </td>
            </tr>
        </tbody>
    </table>
    </form>
  </div>
  <!-- 删除确认弹框 -->
  <div class="modal-preview"  ng-if="showModal">
    <div class="modal modal-primary">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" ng-click="closeModel()" data-dismiss="modal" aria-hidden="true">×</button>
            <h4 class="modal-title">删除商品大类别</h4>
          </div>
          <div class="modal-body">
            <p>确认删除此商品大类别？请谨慎操作！</p>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-warning" data-dismiss="modal" ng-click="closeModel()">取消</button>
            <button type="button" class="btn btn-primary" ng-click="deleteGoods()">确认</button>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="mask" ng-if="showModal"></div>

</div>
<script>
$(function() {
  $( ".modal-preview" ).draggable();
});
</script>
